<template>
  <div class="subcategory">
    <van-grid :gutter="10" column-num="3">
      <van-grid-item
        v-for="sub in subCategories"
        :key="sub.id"
        :icon="sub.imageUrl"
        :text="sub.title"
      />
    </van-grid>
  </div>
</template>

<script>
import { findSubCategories } from '@/api/category'

export default {
  name: 'SubCategory',
  data () {
    return {
      subCategories: []
    }
  },
  watch: {
    $route: {
      handler (newRoute) {
        const { id } = newRoute.params
        findSubCategories(id)
          .then(data => {
            // console.log('子分类', data)
            this.subCategories = data.categories
          })
          .catch(() => {})
      },
      immediate: true
    }
  }
}
</script>

<style lang="scss" scoped>

</style>
